<template>
	<view class="new-users copy-data " >
		<view class="absolute  body_bg  inset-0 " style="height: 100vh;"></view>
		
		<view v-if="userInfo" class="mid" style="flex:1;overflow: hidden;">
			<scroll-view scroll-y="true" style="height: 100%;">
				<view class="head">
					<view class="user-card ">
						<view class="bg"></view>
						<view class="user-info">
							<view>
								<view  class="avatar-box" >
				
									<image  class="avatar" src="../../static/images/f.png" >
									</image>
								</view>
						
							</view>

							<view class="info">
			
								<view class="name" v-if="userInfo">
									{{userInfo.gongyingshangmingcheng?userInfo.gongyingshangmingcheng:''}}
		
								</view>
								<view class="" >
									{{userInfo.lianxidianhua}}	
								</view>
								<view class="mt-5 text-red" v-if="userInfo.status == 0">
									待审核
								</view>
								<view class="mt-5 text-red" v-else-if="userInfo.status == -1">
									未通过审核
								</view>
								<view class="mt-5 text-red" v-if="userInfo.status == -1 && userInfo.shhf">
									未通过理由：{{userInfo.shhf}}
								</view>
							</view>

						</view>
		
					</view>

				</view>
			
				<!-- 会员菜单 -->
				<view class="user-menus shadow2" style="margin-top: 20rpx;">
					<u-cell-group :border="false">
						<u-cell  icon="account"  @click="gogo('/pages/user_edit/index')"  title="资料管理" isLink></u-cell>
						<u-cell icon="list-dot"  @click="gogo('/pages/my_tb/index')"  title="我的投标" isLink></u-cell>
						<u-cell icon="heart"  @click="gogo('/pages/my_sc/index')"  title="招标收藏"  isLink></u-cell>
						<button open-type="contact" style="text-align: start;">
						<u-cell icon="server-man"   :border="false" title="联系客服" isLink></u-cell>
						</button>
					</u-cell-group>
				</view>

                   
				<!-- <view class="footer">
					客服电话：<text @click="kefuCall" class="clr-blue">400-000-0000</text>
					<u-button type="primary" text="退出登录"></u-button>
				</view> -->
			   
				<view class="uni-p-b-98"></view>
			</scroll-view>
		</view>
		<view v-else-if="!userInfo " class="" style="margin: 200px 50px 0 50px;">
			<u-button @click="goLogin" color="#007AFF" :hairline="false" shape="circle">
				<view class="display-flex-align-center display-flex">
					<label class="lotext">授权登录</label>
				</view>
			</u-button>
		</view>
		<u-no-network></u-no-network>
	</view>
</template>
<script>
	let sysHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
	import Cache from '@/utils/cache';
	
	import {
		getUserInfo
	} from "../../api/api.js";

	import {
		toLogin
	} from '@/libs/login.js';
	import {
		mapGetters
	} from "vuex";

	const app = getApp();

	export default {
		components: {
		},
		computed: mapGetters(['isLogin']),
		filters: {
			coundTime(val) {
				var setTime = val * 1000
				var nowTime = new Date()
				var rest = setTime - nowTime.getTime()
				var day = parseInt(rest / (60 * 60 * 24 * 1000))
				// var hour = parseInt(rest/(60*60*1000)%24) //小时
				return day + '天'
			},
			dateFormat: function(value) {
				return dayjs(value * 1000).format('YYYY-MM-DD');
			}
		},
		data() {
			return {
				loading: false,
				
				userInfo: '',
				
			}
		},
		onLoad(options) {
			let that = this;
			
			if (that.isLogin == false) {
				toLogin()
			} else {

			}
			
			

		},
		onReady() {
			
		},
		onShow: function() {
			if (this.isLogin) {
				this.getuser()
			} else {
			
			}
		
		},
		methods: {
			getuser(){
				getUserInfo().then(res => {
					this.userInfo = res.data
				}).catch(err => {
					console.log("err",err)
				})
			},
			goLogin(){
				toLogin()
			},
			gogo(url){
				if (this.isLogin == false) {
					toLogin();
				} else {
				uni.navigateTo({
					url: url,
					fail(err) {
						console.log(12,err)
					}
				})
				
				}
			},
		},
		onPageScroll(e) {
		}
	}
</script>

<style lang="scss">
	page,
	body {
		height: 100%;
	}

	.main {
		background: linear-gradient(to bottom, #ff55ff, #ff55ff, #ff55ff, #efeff4, #efeff4, #efeff4);

	}

	.new-users {
		display: flex;
		flex-direction: column;
		height: 100%;
		color:#000;
		.sys-head {
			position: relative;
			width: 100%;
			// background: linear-gradient(90deg, #ff55ff 0%, #ff55ff 100%);

			.bg {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				// background: url("~@/static/images/user-sys.png") no-repeat;
				background-size: 100% auto;
				background-position: left bottom;
			}

			.sys-title {
				z-index: 10;
				position: relative;
				height: 43px;
				text-align: center;
				line-height: 43px;
				font-size: 36rpx;
				color: #000;
			}
		}

		.head {
			// background: #fff;

			.user-card {
				position: relative;
				// width: 100%;
				// height: 340rpx;
				margin: 0 auto;
				padding: 35rpx 50rpx;
				// background: url("~@/static/images/user_bg.png") no-repeat;
				background-size: 100% auto;

				.user-info {
					z-index: 20;
					position: relative;
					display: flex;

					.headwear {
						position: absolute;
						right: -4rpx;
						top: -14rpx;
						width: 44rpx;
						height: 44rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}

					.live {
						width: 28rpx;
						height: 28rpx;
						margin-left: 20rpx;
					}

					.bntImg {
						width: 120rpx;
						height: 120rpx;
						border-radius: 50%;
						text-align: center;
						line-height: 120rpx;
						background-color: unset;
						position: relative;

						.avatarName {
							font-size: 16rpx;
							color: #fff;
							text-align: center;
							background-color: rgba(0, 0, 0, 0.6);
							height: 37rpx;
							line-height: 37rpx;
							position: absolute;
							bottom: 0;
							left: 0;
							width: 100%;
						}
					}

					.avatar-box {
						position: relative;
						display: flex;
						align-items: center;
						justify-content: center;
						width: 120rpx;
						height: 120rpx;
						border-radius: 50%;

						&.on {
							.avatar {
								border: 2px solid #FFAC65;
								border-radius: 50%;
							}
						}
					}

					.avatar {
						position: relative;
						width: 120rpx;
						height: 120rpx;
						border-radius: 50%;

					}

					.info {
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						margin-left: 20rpx;
						padding: 15rpx 0;

						.name {
							display: flex;
							align-items: center;
							color: #000;
							font-size: 31rpx;

							.vip {
								margin-left: 10rpx;

								image {
									width: 78rpx;
									height: 30rpx;
									display: block;
								}
							}
						}

						.num {
							display: flex;
							align-items: center;
							font-size: 26rpx;
							color: #000;

							image {
								width: 22rpx;
								height: 23rpx;
								margin-left: 20rpx;
							}
						}
					}
				}

				.message {
					align-self: flex-start;
					position: relative;
					margin-top: 15rpx;
					margin-right: 34rpx;

					.num {
						position: absolute;
						top: -4px;
						left: 9px;
						min-width: 12px;
						height: 12px;
						border-radius: 6px;
						background-color: #f30000;
						font-size: 9px;
						line-height: 12px;
						text-align: center;
						color: #ffffff;
					}

					.iconfont {
						font-size: 40rpx;
						color: #000;
					}
				}

				.num-wrapper {
					z-index: 30;
					position: relative;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-top: 22rpx;
					// padding: 0 47rpx;
					color: #000;

					.num-item {
						width: 33.33%;
						text-align: center;

						.num {
							font-size: 42rpx;
							font-weight: bold;
						}

						.txt {
							margin-top: 8rpx;
							font-size: 26rpx;
							color: rgba(94, 94, 94, 0.6);
						}
					}
				}

				.sign {
					z-index: 200;
					position: absolute;
					right: -12rpx;
					top: 80rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					width: 120rpx;
					height: 60rpx;
					background: linear-gradient(90deg, rgba(255, 225, 87, 1) 0%, rgba(238, 193, 15, 1) 100%);
					border-radius: 29rpx 4rpx 4rpx 29rpx;
					color: #282828;
					font-size: 28rpx;
					font-weight: bold;
				}
			}

			.order-wrapper {
				background: #000;
				margin: 0 30rpx;
				border-radius: 16rpx;

				.order-hd {
					justify-content: space-between;
					padding: 30rpx 20rpx 10rpx;
					margin-top: 25rpx;
					font-size: 30rpx;
					color: #282828;

					.left {
						font-weight: bold;
					}

					.right {
						align-items: center;
						color: #666666;
						font-size: 26rpx;

						.icon-xiangyou {
							margin-left: 5rpx;
							margin-top: 6rpx;
							font-size: 26rpx;
						}
					}
				}

				.order-bd {
					display: flex;
					padding: 0 0;

					.order-item {
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						width: 25%;
						height: 160rpx;

						.pic {
							position: relative;
							text-align: center;

							image {
								width: 58rpx;
								height: 58rpx;
							}
						}

						.txt {
							margin-top: 6rpx;
							font-size: 26rpx;
							color: #454545;
						}
					}
				}
			}
		}

		.slider-wrapper {
			margin: 20rpx 0;
			height: 130rpx;

			swiper,
			swiper-item {
				height: 100%;
			}

			image {
				width: 100%;
				height: 130rpx;
			}
		}

		.user-menus {
			background-color: #fff;
			margin: 0 30rpx;
			border-radius: 16rpx;

			.menu-title {
				padding: 30rpx 30rpx 40rpx;
				font-size: 30rpx;
				color: #282828;
			}

			.list-box {
				display: flex;
				flex-wrap: wrap;
				padding: 0;
			}

			.item {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: space-between;
				flex-direction: column;
				width: 25%;
				margin-bottom: 47rpx;
				font-size: 26rpx;
				color: #333333;

				image {
					width: 52rpx;
					height: 52rpx;
					margin-bottom: 18rpx;
				}


				&:last-child::before {
					display: none;
				}
			}

			button {
				font-size: 28rpx;
			}
		}

		.phone {
			color: #000;
		}

		.order-status-num {

			min-width: 12rpx;
			background-color: #fff;
			color: #007Aff;
			border-radius: 25px;
			position: absolute;
			right: -14rpx;
			top: -15rpx;
			font-size: 20rpx;
			padding: 0 8rpx;
			border: 1px solid #007Aff;
		}

		.support {
			width: 219rpx;
			height: 74rpx;
			margin: 54rpx auto;
			display: block;
		}
	}

	
	.setting {
		margin-top: 15rpx;
		color: #000;

		.iconfont {
			font-size: 40rpx;
		}
	}

	.new-users {
		padding-bottom: 0;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.alert {
		background-color: #eff1f9;
		border: 2rpx solid #d3d8f5;
	}
	.footer {
		position: absolute;
		//bottom: 0;
		font-size: 15px;
		color: #ff55ff;
		left: 25%;
		padding-top: 25px;
		padding-bottom: 10px;
	}

	
	
</style>
